<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>用户列表</title>
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<script src="/js/vue.js"></script>
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
	<script src="/js/jquery-3.1.1.min.js"></script>
	<script src="/js/myhttp.js"></script>
</head>
<body>
<div id="app">
	<el-form :inline="true" class="demo-form-inline" >
		<el-form-item >
			<el-button type="success" @click="QueryData()">刷新</el-button>
		</el-form-item>
	</el-form>

	<el-table border :data="dataList" style="width:100%">
		<el-table-column label="用户ID" prop="uid" ></el-table-column>
		<el-table-column label="登录名" prop="loginaccount"></el-table-column>
		<el-table-column>
			<template slot-scope="x">
				<el-button type="warning" size="mini" @click="Update(x.$index,x.row)">设置角色</el-button>
			</template>
		</el-table-column>
	</el-table>

	<el-dialog :visible.sync="Updateing" width="30%" title="设置用户角色">
		<el-form label-width="80px">

			<el-form-item label="角色">
				<el-select v-model="news.roleid">
					<el-option v-for="item in roleList" :label="item.rolename" :value="item.uid" ></el-option>
				</el-select>
			</el-form-item>

			<el-form-item >
				<el-button type="success" size="mini" @click="SubmitUpdate()" >提交数据</el-button>
			</el-form-item>
		</el-form>
	</el-dialog>

</div>
</body>
<script>
	new Vue({
		el:"#app",
		data: {
			Createing:false,
			Updateing:false,
			dataList:[],
			news:{},
			select:{},
			roleList:[],

		},
		methods:{
			SubmitNew(){

			},
			SubmitUpdate(){
				let that=this
				myhttps("/Permission/updateUr",
						{
							uuid:this.select.uid,
							ruid:this.news.roleid
						}
				).then(res=>{
					that.$message.success("成功")
					that.select = {}
					that.Updateing = false
				}).catch(res=>{
					that.$message.error("错误"+res.msg)
				})
			},
			SubmitDelete(idx,row){

			},
			InsertNew(){
				this.news = {}
				this.Createing = true
			},
			Update(idx,row){
				this.select = row
				this.Updateing = true
			},
			QueryData(){
				let that=this
				myhttps("/User/QueryAllUser",{}).then(res=>{
					that.dataList = res.body
				}).catch(res=>{
					that.$message.error("错误："+res.msg)
				})

				myhttps("/Roles/get",{}).then(res=>{
					that.roleList = res.body
				}).catch(res=>{
					that.$message.error("错误："+res.msg)
				})
			}
		},
		mounted(){
			this.QueryData()
		}
	})

</script>
</html>
